<script setup>
// 在 <script setup> 中，任何以 v 开头的驼峰式命名的变量都可以被用作一个自定义指令。
const vFocus = {
  mounted(el) {
    return el.focus()
  },
}

const xx = (el, binding) => {
  // 这会在 `mounted` 和 `updated` 时都调用
  el.style.color = binding.value
}

const vColor = {
  mounted: xx,
  updated: xx,
}
</script>

<template>
  <div>
    <input type="text" v-focus />
    <div v-color="'red'">123</div>
  </div>
</template>